<template>
  <div style="padding: 10px">
    <a-breadcrumb style="font-size: 18px; font-weight: bold; margin-bottom: 20px">
      <a-breadcrumb-item>用户管理</a-breadcrumb-item>
      <a-breadcrumb-item>用户管理</a-breadcrumb-item>
    </a-breadcrumb>

    <a-table
      :dataSource="userInfoList"
      :row-key="(record) => record.trade_id"
      :columns="columns"
      bordered
    >
      <template #sex="{ text }">
        {{
        text == 0 ? "男" : "女"
        }}
      </template>
    </a-table>
  </div>
</template>

<script setup>
//引入ref函数，用于构造单向绑定数据
import { ref, reactive, computed, nextTick, createVNode } from "vue";
//引入useRouter函数，用于获取路由器对象
import { useRouter } from "vue-router";
//引入函数，用于向服务端发送get请求
import { get, del, post, getBlob, put, tip, removeLocalToken } from "@/common";

const columns = [
  {
    title: "公钥",
    dataIndex: "user_id",
    ellipsis: true
  },
  {
    title: "姓名",
    dataIndex: "name"
  },
  {
    title: "性别",
    dataIndex: "sex",
    slots: {
      customRender: "sex"
    }
  },
  {
    title: "年龄",
    dataIndex: "age"
  },
  {
    title: "居住地址",
    dataIndex: "address"
  },
  {
    title: "工作单位",
    dataIndex: "work_unit"
  },
  {
    title: "邮箱",
    dataIndex: "email"
  },
  {
    title: "手机号码",
    dataIndex: "phone_number"
  },
  {
    title: "身份证",
    dataIndex: "id_number"
  },
  {
    title: "电表ID",
    dataIndex: "elec_meter_id"
  },
  {
    title: "余额",
    dataIndex: "balance"
  },
  {
    title: "信用积分",
    dataIndex: "credit_point"
  }
];

const userInfoList = ref([]);
const getUserInfo = () => {
  get("/manager/user/info").then(res => {
    userInfoList.value = res.data;
  });
};
getUserInfo();
</script>